﻿@model PagedList.IPagedList<KLY.DataModels.SearchTruckVehiclePub>
@using PagedList.Mvc;

<div class="wrap">
    <div class="selector">
        <input type="hidden" id="pageName" value="zhengce" />
        <form action="/Freight/zhengche" method="get" role="form">
            <dl>
                <dt>
                    <span>
                        <em>始发地</em>
                        <select id="Start_Area" name="Start_Area" rel="@ViewBag.Start_Area">
                            <option>安徽</option>
                        </select>
                    </span>
                    <span>
                        <em>始发地</em>
                        <select id="End_Area" name="End_Area" rel="@ViewBag.End_Area">
                            <option>安徽</option>
                        </select>
                    </span>
                    <span>
                        <input type="submit" class="btn-query" value="查询" />
                    </span>
                </dt>
                <dd id="vehicleType">
                    <span>车型</span>
                    <input type="hidden" id="Vehicle_Type" name="Vehicle_Type" value="@ViewBag.Vehicle_Type" />
                    <a href="#" rel="0" class="on all">全部</a>
                    <a href="#" rel="1">普通货车</a>
                    <a href="#" rel="2">厢式货车</a>
                    <a href="#" rel="3">封闭货车</a>
                    <a href="#" rel="4">罐式货车</a>
                    <a href="#" rel="5">平板货车</a>
                </dd>

                <dd id="vehicleLen">
                    <span>车长</span>
                    <input type="hidden" id="Vehicle_Len" name="Vehicle_Len" value="@ViewBag.Vehicle_Len" />
                    <a href="#" class="on all" rel="0">全部</a>
                    <a href="#" rel="1">1米</a>
                    <a href="#" rel="2">2米</a>
                    <a href="#" rel="3">3米</a>
                    <a href="#" rel="4">4米</a>
                    <a href="#" rel="5">5米</a>
                </dd>
                <dd id="vehicleLoad">
                    <span>吨位</span>
                    <input type="hidden" id="Vehicle_Load" name="Vehicle_Load" value="@ViewBag.Vehicle_Load" />
                    <a href="#" class="on all" rel="0">全部</a>
                    <a href="#" rel="1">1吨</a>
                    <a href="#" rel="3">3吨</a>
                    <a href="#" rel="5">5吨</a>
                    <a href="#" rel="10">10吨</a>
                </dd>
                <dd id="timeEnd">
                    <span>出发时间</span>
                    <input type="hidden" id="Time_End" name="Time_End" value="@ViewBag.Time_End" />
                    <a href="#" class="on all" rel="0">全部</a>
                    <a href="#" rel="1">1天内</a>
                    <a href="#" rel="2">2天内</a>
                    <a href="#" rel="5">5天内</a>
                    <a href="#" rel="10">10天内</a>
                </dd>
            </dl>
        </form>
</div>
    <div class="zclist">
        <dl>
            <dt>
                <span class="w308">物流公司/个人</span>
                <span class="wleft">运输线路</span>
                <span>运输时效</span>
                <span>运输价格</span>
                <span>操作</span>
            </dt>
@foreach (var item in Model)
{
             <dd>
                <span class="w308">
                    <i>@Html.DisplayFor(modelItem => item.Owner_Name)</i>
                    <em>@Html.DisplayFor(modelItem => item.Owner_Phone)</em>
                </span>
                <span class="wleft">从：<small>@Html.DisplayFor(modelItem => item.start_area)</small><br />到：<small>@Html.DisplayFor(modelItem => item.End_Area)</small></span>
                <span><small>@Html.DisplayFor(modelItem => item.shipment_time)天</small><br />整车运输</span>
                <span class="mt15"><samp>@Html.DisplayFor(modelItem => item.price)</samp>元</span>
                <span><a href="#" class="btn">我要发货</a></span>
            </dd>
}
        </dl>
    </div>
    <div style="text-align:right">
        @Html.PagedListPager(Model, page => Url.Action("Zhengche", new { ViewBag.Start_Area, ViewBag.End_Area, ViewBag.Vehicle_Type, ViewBag.Vehicle_Len, ViewBag.Vehicle_Load, ViewBag.Time_End, page }))
    </div>
    </div>
<script language="javascript">
    $(document).ready(function () {
        $.ajax({
            url: "/api/DistinctApi/GetAllProvinceInfo",
            type: "GET",
            success: function (data) {
                //alert(JSON.stringify(data.result));
                var departCity = $("#Start_Area");
                var arriveCity = $("#End_Area");

                $("#Start_Area option").remove();
                $("#End_Area option").remove();

                departCity.append("<option value='-1'>选择起始地</option>");
                arriveCity.append("<option value='-1'>选择目的地</option>");

                $.each(JSON.parse(data).result, function (key, value) {
                    var opt = $("<option></option>").text(value).val(key);
                    var opt2 = $("<option></option>").text(value).val(key);
                    departCity.append(opt);
                    arriveCity.append(opt2);
                });

                SetSelectValue();


            }
        });

        $("dd[id='vehicleType'] a").click(function () {
            $("dd[id='vehicleType'] a").each(function () {
                $(this).attr("class","")
            });
            $(this).attr("class","on all")
            $("#Vehicle_Type").val($(this).attr("rel"));
        })

        $("dd[id='vehicleLen'] a").click(function () {
            $("dd[id='vehicleLen'] a").each(function () {
                $(this).attr("class", "")
            });
            $(this).attr("class", "on all")
            $("#Vehicle_Len").val($(this).attr("rel"));
        })

        $("dd[id='vehicleLoad'] a").click(function () {
            $("dd[id='vehicleLoad'] a").each(function () {
                $(this).attr("class", "")
            });
            $(this).attr("class", "on all")
            $("#Vehicle_Load").val($(this).attr("rel"));
        })

        $("dd[id='timeEnd'] a").click(function () {
            $("dd[id='timeEnd'] a").each(function () {
                $(this).attr("class", "")
            });
            $(this).attr("class", "on all")
            $("#Time_End").val($(this).attr("rel"));
        })
    });

    function SetSelectValue() {
        $("#Start_Area").val($("#Start_Area").attr("rel"));
        $("#End_Area").val($("#End_Area").attr("rel"));

        var i = 0;
        $("dd[id='vehicleType'] a").each(function () {
            if ($(this).attr("attr") == $("#Vehicle_Type").val()) {
                $(this).attr("class", "on all")
            }
            else {
                $(this).attr("class", "")
            }
            if (i == 0 && ($("#Vehicle_Type").val() == null || $("#Vehicle_Type").val() == "")) {
                $(this).attr("class", "on all")
            }
            i++;
        });

        i = 0;
        $("dd[id='vehicleLen'] a").each(function () {
            if ($(this).attr("attr") == $("#vehicleLen").val()) {
                $(this).attr("class", "on all")
            }
            else {
                $(this).attr("class", "")
            }
            if (i == 0 && ($("#vehicleLen").val() == null || $("#vehicleLen").val() == "")) {
                $(this).attr("class", "on all")
            }
            i++;
        });

        i = 0;
        $("dd[id='vehicleLoad'] a").each(function () {
            if ($(this).attr("attr") == $("#vehicleLoad").val()) {
                $(this).attr("class", "on all")
            }
            else {
                $(this).attr("class", "")
            }
            if (i == 0 && ($("#vehicleLoad").val() == null || $("#vehicleLoad").val() == "")) {
                $(this).attr("class", "on all")
            }
            i++;
        });

        i = 0;
        $("dd[id='timeEnd'] a").each(function () {
            if ($(this).attr("attr") == $("#timeEnd").val()) {
                $(this).attr("class", "on all")
            }
            else {
                $(this).attr("class", "")
            }
            if (i == 0 && ($("#timeEnd").val() == null || $("#timeEnd").val() == "")) {
                $(this).attr("class", "on all")
            }
            i++;
        });

    }
</script>
